<%@page import="POJO.SanPhamPOJO"%>
<%@page import="java.util.ArrayList"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>

<script charset="utf-8" type="text/javascript" src="CSS/jquery.prettyPhoto.js"></script>
<script charset="utf-8" type="text/javascript" src="CSS/jquery-1.6.4.min.js"></script>

<link type="text/css" rel="stylesheet" media="screen" href="CSS/layout.css">
<link type="text/css" rel="stylesheet" media="screen" href="CSS/style.css">
<div id="wrapper">  	  	
    <div id="content">
        <div class="breadcrumb">
            <span><img height="12" width="12" alt="Trang chủ" src="xlogin_files/icon_link.gif"><a href="#">Trang chủ</a></span> <span>Chi Tiết Sản Phẩm</span>
        </div>
        <div class="clear"></div>
        <div class="other_content">
            <div class="top_other_content">
                <div class="ltop_other_content"></div>
                <div class="rtop_other_content"></div>	
            </div>
            <%
                SanPhamPOJO sp = (SanPhamPOJO) request.getAttribute("chitietsanphamAttribute");

            %>
            <div class="login">
                <div class="banner_login2" align ="center">
                    <img  alt="Sản phẩm" src="<%= sp.getHinhAnh()%>">

                    <!--START POPUP IMAGE -->
                    <a href="#?w=700" rel="popup2" class="poplight" >XEM HÌNH LỚN</a>

                    <div id="popup2" class="popup_block" style="display: none; width: 500px; margin-top: -160px; margin-left: -290px;" align ="center">
                        <a class="close" href="#">
                            <img class="btn_close" alt="Close" title="Close Window" src="Images/close_pop.png">
                        </a>
                        <a href="#">
                            <img style="float: left; margin: 50px 0 0 20px;" alt="Lil bomb dude" src="<%= sp.getHinhAnh()%>">
                        </a>
                        <h2>Tên sản phẩm:<font face="Tahoma, Geneva, sans-serif" size="+1" color="#0000FF"><%=sp.getTenSanPham()%></font></h2>

                    </div>

                    <!-- END POPUP IMAGE-->
                </div>

                <div class="box_login">
                    <div class="top_box_login">
                        <div class="ltop_box_login"></div>
                        <div class="rtop_box_login"></div>
                    </div>

                    <div class="center_box_login">
                        <h2 class="title" > &nbsp;&nbsp; CHI TIẾT SẢN PHẨM: </h2>
                        <p>&nbsp;</p>

                        &nbsp;&nbsp;&nbsp;   Mã sản phẩm:       <font face="Tahoma, Geneva, sans-serif" size="+1" color="#0000FF"><%=sp.getMaSanPham()%></font>     </br></br>   
                        &nbsp;&nbsp;&nbsp;   Tên sản phẩm:      <font face="Tahoma, Geneva, sans-serif" size="+1" color="#0000FF"><%=sp.getTenSanPham()%></font>     </br></br>   
                        &nbsp;&nbsp;&nbsp;   Nhà sản xuất:      <font face="Tahoma, Geneva, sans-serif" size="+1" color="#0000FF"><%=sp.getMaNhaSanXuat()%></font>  </br></br> 
                        &nbsp;&nbsp;&nbsp;   Số lượng hàng còn: <font face="Tahoma, Geneva, sans-serif" size="+1" color="#0000FF"><%=sp.getSoLuong()%></font>       </br></br> 
                        &nbsp;&nbsp;&nbsp;   Khuyến mãi:        <font face="Tahoma, Geneva, sans-serif" size="+1" color="#0000FF"><% if (sp.getDangGiamGia() == 0) {%> Sản phẩm hiện không có khuyến mãi <%  } else {%> Sản phẩm đang khuyến mãi <%}%> </font>   </br>   </br> 
                        &nbsp;&nbsp;&nbsp;   Giá bán:           <font face="Tahoma, Geneva, sans-serif" size="+1" color="#FF0000"> <%=sp.getGiaBan()%></font>       </br></br> 

                        <a href="ShoppingCartController?Action=Buy&MaSanPham=<%=sp.getMaSanPham()%>">
                            <div align="center"><img  alt="Sản phẩm" src="Images/Images_css_files/btn_order.jpg"></div></a>
                        <h2 class="title" >&nbsp;&nbsp; THÔNG SỐ VÀ CHỨC NĂNG: </h2>  
                        <div class="button_listing_input">
                            <b><%=sp.getThongSo()%></b>   </br></br>      
                        </div>
                    </div>
                    <div class="bottom_box_login">
                        <div class="lbottom_box_login"></div>
                        <div class="rbottom_box_login"></div>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
            <div class="bottom_other_content">
                <div class="lbottom_other_content"></div>
                <div class="rbottom_other_content"></div>
            </div>
        </div>
    </div>
</div>


<!-- START SCRIPT-->
<script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js">
</script>

<script type="text/javascript">
    
    $(document).ready(function(){
        $('a.poplight[href^=#]').click(function() {
            var popID = $(this).attr('rel'); //Get Popup Name
            var popURL = $(this).attr('href'); //Get Popup href to define size

            //Pull Query & Variables from href URL
            var query= popURL.split('?');
            var dim= query[1].split('&');
            var popWidth = dim[0].split('=')[1]; //Gets the first query string value

            //Fade in the Popup and add close button
            $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="close_pop.png" class="btn_close" title="Close Window" alt="Close" /></a>');

            //Define margin for center alignment (vertical   horizontal) - we add 80px to the height/width to accomodate for the padding  and border width defined in the css
            var popMargTop = ($('#' + popID).height() + 80) / 2;
            var popMargLeft = ($('#' + popID).width() + 80) / 2;

            //Apply Margin to Popup
            $('#' + popID).css({
                'margin-top' : -popMargTop,
                'margin-left' : -popMargLeft
            });

            //Fade in Background
            //$('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
           // $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies 

            return false;
        });

        //Close Popups and Fade Layer
        $('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
            $('#fade , .popup_block').fadeOut(function() {
                $('#fade, a.close').remove();  //fade them both out
            });
            return false;
        });
    
    }); 
</script>

<!-- END SCRIPT-->

